<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <button>删除节点</button>
  <ul>
    <li class="item">我是第1个li</li>
    <li>我是第2个li</li>
    <li class="item">我是第3个li</li>
    <li>我是第4个li</li>
    <li class="item">我是第5个li</li>
  </ul>
  <div>我是div
    <p>我是段落</p>
  </div>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.js"></script>
  <script>
    $(function () {
      $('button').click(function () {
        // 1.remove 删除指定的元素
        // $('div').remove()

        // 3.detach 和 remove方法类似 都是删除指定的元素
        $('div').detach()

        // 2.empty 删除指定元素的内容和子元素，指定元素自身不会被删除
        // $('div').empty()

      })
    })
    
  </script>
</body>
</html>